<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title></title>
</head>
<body>

	<!-- div 是一个最常用的容器标签 主要用于页面布局 分隔网页结构 -->
	<!-- p 不能嵌套自己，它最常用的就是放置文本 -->
	<!-- 但是 div 可以嵌套任何标签 -->

	<!-- px 叫做像素点 1px = 一个像素点 -->
	<!-- <div style="width:500px; height: 500px; background: red;">
		<div  style="width: 200px;height: 200px;background: green;">1</div>
		<div  style="width: 200px;height: 200px;background: blue;">2</div>
	</div> -->
	<div style="width: 800px; height: 450px;">
		<div style="width: 800px; height: 150px; background: #d3d3d3;">
			<div style="width: 200px; height: 50px; background: red;"></div>
		</div>
		<div style="width: 800px; height: 150px; background: blue;"></div>
		<div style="width: 800px; height: 150px; background: red;"></div>
	</div>
</body>
</html>